import { InboxOutlined, UploadOutlined } from '@ant-design/icons';
import {
    Button,
    Checkbox,
    Col,
    Form,
    InputNumber,
    Radio,
    Rate,
    Row,
    Select,
    Slider,
    Switch,
    Upload,
    Input,
    DatePicker,
    TimePicker,
    message
} from 'antd';
import http from '../../../../utils/fetchHttp';
import dayjs from 'dayjs';
import React, { useContext } from 'react';
import mycontext from '../../../../utils/myContext';
import "./index.scss"


const { Option } = Select;
const { RangePicker } = DatePicker;
let father;
let timeData;//公用时间数据
let addTimeData;//时间提交对象
let clickData = 0 //判断是否被点击
let editPurchaseId //编辑ID

const formItemLayout = {
    labelCol: {
        span: 6,
    },
    wrapperCol: {
        span: 14,
    },
};
//修改时间
const changeTime = () => {
    clickData = 1
    console.log(clickData);
}
//提交成功
const onFinish = (fieldsValue) => {
    // 中国标准时间 转换成 年月日
    const formatDateTime = (date) => {
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        m = m < 10 ? ('0' + m) : m;
        var d = date.getDate();
        d = d < 10 ? ('0' + d) : d;
        var h = date.getHours();
        var minute = date.getMinutes();
        minute = minute < 10 ? ('0' + minute) : minute;
        var second = date.getSeconds();
        second = second < 10 ? ('0' + second) : second;
        return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
    }
    let values = {
        ...fieldsValue,
    };

    //类型
    let myType;
    if (values.purchaseType.length === 1) {
        values.purchaseType.push(" ");
        myType = values.purchaseType.toString();
        myType = myType.slice(0, -2)
    } else {
        myType = values.purchaseType.join(",");
    }

    // const rangeValue = fieldsValue['range-picker'];
    // values = {
    //     ...fieldsValue,
    //     'range-picker': [rangeValue[0].$d, rangeValue[1].$d],
    // };

    //修改日期时
    if (clickData !== 0) {
        const rangeValue = fieldsValue['range-picker'];
        values = {
            ...fieldsValue,
            'range-picker': [rangeValue[0].$d, rangeValue[1].$d],
        };
        timeData = [formatDateTime(rangeValue[0].$d), formatDateTime(rangeValue[1].$d)]
        addTimeData = timeData
        console.log(addTimeData);
    }
    console.log(values.productGrounding,'values.productGrounding');

    const addObj = {
        purchaseId: editPurchaseId,
        purchaseTitle: values.purchaseTitle,
        purchaseDetail: values.purchaseDetail,
        purchaseType: myType,
        purchaseProductId: values.purchaseProductId,
        startTime: addTimeData[0],
        endTime: addTimeData[1],
        productGrounding: values.productGrounding == true ? 1 : 0
    }
    console.log(addObj);

    // 编辑请求
    http({
        url: '/purchase/editData',
        method: 'post',
        data: addObj
    }).then(res => {
        if (res.code === 200) {
            console.log(res);
            message.success('编辑成功');
        } else {
            console.log(res);
            message.error('编辑失败');
        }
    })

    const { getCount } = father;
    const value = 0
    getCount(value);
};

const EditPurchase = (props) => {
    const store = useContext(mycontext)
    const data = store.purchaseEditObj;
    editPurchaseId = data.purchaseId;

    let typeArr;
    if (data.purchaseType.length <= 3) {
        typeArr = [data.purchaseType]
    } else {
        typeArr = data.purchaseType.split(",");
    }

    // //时间转换
    timeData = [data.startTime, data.endTime]
    console.log(timeData, '未修改');
    timeData = timeData.map(item => {
        const timeArr = item.split(" ");
        return timeArr[0]
    })
    console.log(timeData,'已修改');
    const dateFormat = 'YYYY-MM-DD';
    addTimeData = timeData


    father = props
    const { getCount } = props;
    const goBack = () => {
        const value = 0
        getCount(value);
    };

    const isProductId = (e) => {
        if (e.target.value) {
            const ProductId = {
                ProductId: e.target.value
            }
            http({
                url: '/purchase/isProductId',
                method: 'post',
                data: ProductId
            }).then(res => {
                console.log(res);
                if (res.code === 200) {
                    message.error('无商品编号');
                }
            })
        }
    }

    const config = {
        rules: [
            {
                type: 'object',
                required: true,
                message: 'Please select time!',
            },
        ],
    };
    const rangeConfig = {
        rules: [
            {
                type: 'array',
                required: true,
                message: 'Please select time!',
            },
        ],
    };

    return (
        <div className='editPurchase'>
            <Form
                name="validate_other"
                {...formItemLayout}
                onFinish={onFinish}
                initialValues={{
                    purchaseTitle: data.purchaseTitle,
                    purchaseDetail: data.purchaseDetail,
                    purchaseType: typeArr,
                    purchaseProductId: data.purchaseProductId,
                    productGrounding: data.productGrounding,
                }}
                style={{
                    maxWidth: 600,
                }}
            >
                <Form.Item
                    label="抢购标题"
                    name="purchaseTitle"
                    rules={[
                        {
                            required: true,
                            message: 'Please input your username!',
                        },
                    ]}
                >
                    <Input placeholder='请输入抢购标题' />
                </Form.Item>
                <Form.Item
                    label="抢购详情"
                    name="purchaseDetail"
                    rules={[
                        {
                            required: true,
                            message: 'Please input your username!',
                        },
                    ]}
                >
                    <Input addonAfter={'公里'} placeholder='请输入抢购详情' />
                </Form.Item>
                <Form.Item name="purchaseType" label="适用行程类型">
                    <Checkbox.Group>
                        <Row>
                            <Col span={8}>
                                <Checkbox
                                    value="徒步"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    徒步
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="登山"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    登山
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="骑行"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    骑行
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="自驾"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    自驾
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="跑步"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    跑步
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="越野跑"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    越野跑
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="旅行"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    旅行
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="滑雪"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    滑雪
                                </Checkbox>
                            </Col>
                            <Col span={8}>
                                <Checkbox
                                    value="其他"
                                    style={{
                                        lineHeight: '32px',
                                    }}
                                >
                                    其他
                                </Checkbox>
                            </Col>
                        </Row>
                    </Checkbox.Group>
                </Form.Item>
                <Form.Item
                    label="适用商品"
                    name="purchaseProductId"
                    rules={[
                        {
                            required: true,
                            message: 'Please input your username!',
                        },
                    ]}
                >
                    <Input
                        placeholder='请输入商品货号'
                        onBlur={isProductId}
                    />
                </Form.Item>
                <Form.Item name="range-picker" label="上架时间段">
                    <RangePicker defaultValue={[dayjs(timeData[0], dateFormat), dayjs(timeData[1], dateFormat)]}
                        format={dateFormat}
                        onChange={changeTime}
                    />
                </Form.Item>
                <Form.Item name="productGrounding" label="上架" valuePropName="checked">
                    <Switch />
                </Form.Item>
                <Form.Item
                    wrapperCol={{
                        xs: {
                            span: 24,
                            offset: 0,
                        },
                        sm: {
                            span: 16,
                            offset: 8,
                        },
                    }}
                >
                    <Button
                        type="primary"
                        htmlType="submit"
                        className='addBtn'
                    >
                        提交
                    </Button>
                    <Button
                        className='goBackBtn'
                        type="primary"
                        htmlType="submit"
                        onClick={goBack}
                    >
                        返回
                    </Button>
                </Form.Item>
            </Form>
        </div>
    );
}

export default EditPurchase;